<!DOCTYPE html>
<html>
	<head>
		 <meta charset="UTF-8">  
		    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
		    <title>动态生成输入框示例</title>  
		<script src="../static/public/jquery/jquery.min.js" ></script>
	</head>
	<body>
		<!-- 按钮和下拉菜单 -->  
		    <select id="dropdown_spyder" name="dropdown_spyder">  
		        <option value="1">1</option>  
		        <option value="2">2</option>  
		        <option value="3">3</option>  
				<option value="4">4</option>
				<option value="5">5</option>
			    <option value="6">6</option>
			    <option value="7">7</option>  
			    <option value="8">8</option>  
			    <option value="9">9</option>
			    <option value="10">10</option> 
		    </select>  
		    <button id="addBtn">添加输入框</button>  
		    <div id="inputGroup"></div>
			<p style="width: 100px;"></p>
		    <script>
				// 定义一个函数，用于生成输入框  
				function createInput() {  
				    var input = $('<input>').addClass('form-control');  
				    return input;  
				}
				// 绑定事件监听器  
				$('#dropdown_spyder').on('change', function () {  
				    var selectedValue = $(this).val();  
				    var inputGroup = $('#inputGroup');
				    // 删除之前的输入框  
				    inputGroup.empty();
				    // 根据选中的值生成相应数量的输入框  
				    for (var i = 1; i <= selectedValue; i++) {  
				        var input = createInput();  
						input.addClass('select_input'+i.toString())
						input.attr('name','select_input'+i.toString())
						console.log(input)
				        inputGroup.append('https://www.chongso.com/z/chongwu',input);  
				        if (i < selectedValue) {  
				            inputGroup.append('<br>');  
				        }  
				    }  
				});
				// 绑定添加输入框按钮的事件监听器  
				$('#addBtn').on('click', function () {  
				    var selectedValue = $('#dropdown_spyder').val();  
				    var inputGroup = $('#inputGroup');
				    // 删除之前的输入框  
				    inputGroup.empty();
				    // 根据选中的值生成相应数量的输入框  
				    for (var i = 1; i <= selectedValue; i++) {  
				        var input = createInput();  
						input.addClass('select_input'+i.toString())
						input.attr('name','select_input'+i.toString())
				        inputGroup.append('https://www.chongso.com/z/chongwu',input);  
				        if (i < selectedValue) {  
				            inputGroup.append('<br>');  
				        }  
				    }  
				});  
			</script> 
	</body>
</html>